	/*  弹出层 */
	.popup {
	    position: fixed;
	    left: 0;
	    top: 0;
	    right: 0;
	    bottom: 0;
	    z-index: 99;

	    &.show {
	        display: block;

	        .mask {
	            animation: showPopup 0.2s linear both;
	        }

	        .layer {
	            animation: showLayer 0.2s linear both;
	        }
	    }

	    &.hide {
	        .mask {
	            animation: hidePopup 0.2s linear both;
	        }

	        .layer {
	            animation: hideLayer 0.2s linear both;
	        }
	    }

	    &.none {
	        display: none;
	    }

	    .mask {
	        display: flex;
	        justify-content: center;
	        align-items: flex-end;
	        position: fixed;
	        left: 0;
	        top: var(--window-top);
	        bottom: 0;
	        width: 100%;
	        z-index: 9995;
	        background-color: rgba(0, 0, 0, 0.5);
	    }

	    .layer {
	        position: relative;
	        bottom: 0;
	        width: 100%;
	        min-height: 920rpx;
	        max-height: 920rpx;
	        border-radius: 16rpx 16rpx 0 0;
	        padding: 24rpx 24rpx 0;
	        overflow-y: hidden;
	        background-color: $theme-panel-bg-color;
	    }

	    @keyframes showPopup {
	        0% {
	            opacity: 0;
	        }

	        100% {
	            opacity: 1;
	        }
	    }

	    @keyframes hidePopup {
	        0% {
	            opacity: 1;
	        }

	        100% {
	            opacity: 0;
	        }
	    }

	    @keyframes showLayer {
	        0% {
	            transform: translateY(120%);
	        }

	        100% {
	            transform: translateY(0%);
	        }
	    }

	    @keyframes hideLayer {
	        0% {
	            transform: translateY(0);
	        }

	        100% {
	            transform: translateY(120%);
	        }
	    }
	}


	/* 规格选择弹窗 */
	.spec-content-box {
	    padding-bottom: 96rpx;
	    font-size: 26rpx;

	    .spec-content {
	        width: 100%;
	        min-height: 898rpx;
	        max-height: 898rpx;
	        padding-bottom: calc(120rpx + var(--safe-area-inset-bottom));
	        overflow-y: scroll;

	        .a-t {
	            display: flex;
	            align-items: flex-end;

	            .img {
	                width: 184rpx;
	                height: 184rpx;
	                // flex-shrink: 0;
	                // margin-top: -40rpx;
	                border-radius: 6rpx;
	            }

	            .right {
	                display: flex;
	                flex: 1;
	                flex-direction: column;
	                padding-left: 20rpx;
	                line-height: 42rpx;

	                .price-box {
	                    font-weight: bold;

	                    .price {
	                        font-size: $theme-size-large-base;

	                        &::before {
	                            content: '￥';
	                            font-size: $theme-size-small-base;
	                            font-weight: 400;
	                        }
	                    }

	                    .decimal {
	                        font-size: $theme-size-base;

	                        &::before {
	                            content: '.'
	                        }
	                    }
	                }

	                .stock {
	                    margin-top: 16rpx;
	                    font-size: $theme-size-small-base;
	                    color: $theme-color-ghost-base;
	                }

	                .selected-text {
	                    margin-top: 16rpx;
	                    font-size: $theme-size-small-base;
	                    color: $theme-color-main-base;
	                }
	            }
	        }

	        .spec-list {
	            display: flex;
	            flex-direction: column;
	            margin-top: 52rpx;

	            .spec-title {
	                color: $theme-color-main-base;
	                font-size: 28rpx;
	            }

	            .item-list {
	                margin-top: 20rpx;
	                display: flex;
	                flex-wrap: wrap;
	                color: $theme-color-base;
	                font-size: $theme-size-small-base;

	                .tit {
	                    display: flex;
	                    align-items: center;
	                    justify-content: center;
	                    background-color: #F6F6F8;
	                    margin-right: 20rpx;
	                    border-radius: 12rpx;
	                    margin-bottom: 20rpx;
	                    min-width: 60rpx;
	                    height: 64rpx;
	                    padding: 0 16rpx;
	                }

	                .selected {
	                    border: 2rpx solid;
	                }
	            }
	        }



	        .buy-num-wrap {
	            margin-top: 80rpx;
	            margin-bottom: 250rpx;

	            .title {
	                color: $theme-color-main-base;
	                font-size: 30rpx;
	            }

	            .number {
	                .input-box {
	                    overflow: hidden;
	                    border-radius: 2rpx;
	                    margin: 0 2rpx;
	                    width: 68rpx;
	                    height: 56rpx;
	                    background-color: rgba(235, 235, 235, 1);

	                    input {
	                        color: $theme-color-main-base;
	                        font-size: 36rpx;
	                        width: 100%;
	                        height: 100%;
	                    }
	                }

	                .sub,
	                .add {
	                    font-size: 42rpx;
	                    border-radius: 2rpx;
	                    width: 68rpx;
	                    height: 56rpx;
	                    line-height: 56rpx;
	                    color: $theme-color-ghost-base;
	                    background-color: #F5F5F5;
	                    border-radius: 6rpx 0 0 6rpx;
	                }

	            }
	        }
	    }
	}